@import '~antd/dist/antd.css';

* {
	margin: 0%;
}

html {
	font-size: 2vmin;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	transition-delay: 111111s;
	transition: color 111111s ease-out, background-color 111111s ease-out;
}
.register {
	width: 100vw;
	height: 100vh;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	display: flex;
	justify-content: center;
	align-items: center;

	.container {
		width: 60%;
		min-height: 60%;
		background-color: rgba($color: #000, $alpha: 0.5);
		transition: 300ms;
		border-radius: 1rem;
		color: white;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		box-shadow: inset 1px 1px 7px rgba(250, 252, 255, 0.58),
			inset -1px -1px 7px rgba(6, 4, 1, 0.42);

		.title {
			font-size: 1.75rem;
			user-select: none;
		}

		&:hover,
		&:focus {
			backdrop-filter: blur(10px);
		}

		.inputs {
			width: 80%;

			.ant-input-affix-wrapper,
			.ant-input,
			input:-webkit-autofill,
			input:-webkit-autofill:hover,
			input:-webkit-autofill:focus,
			input:-webkit-autofill:active {
				background-color: rgba($color: #000000, $alpha: 0);
				color: white;
				border-top: none;
				border-left: none;
				border-right: none;
				box-shadow: none;
				font-size: 1.25rem;

				&::selection {
					background-color: rgba($color: #000, $alpha: 0.3);
				}

				.ant-input-password-icon {
					color: white;
				}
			}

			.ant-form-item-has-error :not(.ant-input-disabled):not(.ant-input-borderless).ant-input,
			.ant-form-item-has-error
				:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper,
			.ant-form-item-has-error
				:not(.ant-input-number-affix-wrapper-disabled):not(.ant-input-number-affix-wrapper-borderless).ant-input-number-affix-wrapper,
			.ant-form-item-has-error
				:not(.ant-input-disabled):not(.ant-input-borderless).ant-input:hover,
			.ant-form-item-has-error
				:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper:hover,
			.ant-form-item-has-error
				:not(.ant-input-number-affix-wrapper-disabled):not(.ant-input-number-affix-wrapper-borderless).ant-input-number-affix-wrapper:hover {
				background-color: rgba($color: #000000, $alpha: 0);
				box-shadow: none;
			}
			.ant-input-group-addon {
				color: white;
				background-color: rgba($color: #000000, $alpha: 0);
				border: none;
				user-select: none;
				font-size: 1.15rem;

				.ant-select {
					color: white;
					font-size: 1.15rem;
					width: 12rem;

					.ant-select-selector {
						padding: 0%;
					}

					&-focused .ant-select-selector {
						color: whitesmoke;
					}

					.ant-select-arrow {
						color: white;
					}
				}
			}
		}
	}
}
